<template>
  <view class="page">
    <!-- 编辑 -->
    <view class="article-edit">
      <view class="edit" @click="isEdit = !isEdit">
        <text>{{isEdit?'完成':'编辑'}}</text>
      </view>
    </view>
    <!-- 文章列表 -->
    <view class="article-list">
      <view class="list" v-for="(item,index) in discover" :key="index" ref="list">
        <view class="check" :style="isEdit?'display: flex':'display: none'">
          <text @click="checked(item.id,index)"
            :class="!checkbuttonarr[index].checkbutton?'iconfont icon-check':'iconfont icon-checked'"></text>
        </view>
        <view class="item">
          <view class="title">
            <text>{{item.title}}</text>
          </view>
          <view class="like">
            <text>{{item.collections}}人喜欢</text>
          </view>
        </view>
        <view class="thumb">
          <image :src="item.image"></image>
        </view>
      </view>
    </view>
    <!-- 底部 -->
    <view class="footer-btn" :style="isEdit?'display: flex':'display: none'">
      <view @click="OnDeLike" class="btn">取消收藏</view>
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        isEdit: false,
        discover: '',
        idList: [],
        checkbuttonarr: []
      };
    },
    onShow() {
      uni.request({
        url: 'http://localhost:8089/cgoAdmin/getMyLikeGoods',
        data: {
          userId: this.$queue.getData("id")
        },
        method: 'POST',
        header: {
          "content-type": 'application/x-www-form-urlencoded'
        },
        success: (res) => {
          this.discover = res.data.result;
          for (var i = 0; i < res.data.result.length; i++) {
            var checked = {
              'checkbutton': false
            };
            this.checkbuttonarr.push(checked);
          }

        }
      })
    },
    methods: {
      checked: function(id, index) {
        if (!this.checkbuttonarr[index].checkbutton) {
          this.idList.push(id);
          this.checkbuttonarr[index].checkbutton = true;  
        } else {
          this.idList.splice(this.idList.indexOf(id), 1);
          this.checkbuttonarr[index].checkbutton = false;
        }
      },
      OnDeLike() {
        uni.request({
          url: 'http://localhost:8089/cgoAdmin/delMylike',
          data: {
            ids: this.idList
          },
          method: 'POST',
          header: {
            "content-type": 'application/x-www-form-urlencoded'
          },
          success: (res) => {
            if (res.data.success) {
              this.$queue.showToast("取关成功");
              setTimeout(function() {
                uni.redirectTo({
                  url: "/pages/ContentCollection/ContentCollection",
                })
              }, 1000)


            } else {
              if (res.data.message != null)
                this.$queue.showToast(res.data.message);
            }
          }
        })
        this.isEdit=false
      }
      
    }
  }
</script>

<style scoped lang="scss">
  @import 'ContentCollection.scss'
</style>